{% load static %}
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>分类</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <script src="{% static 'js/rem.js' %}"></script>
    <script src="{% static 'js/jquery.min.js' %}" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="{% static 'css/base.css' %}"/>
    <link rel="stylesheet" type="text/css" href="{% static 'css/page.css' %}"/>
    <link rel="stylesheet" type="text/css" href="{% static 'css/all.css' %}"/>
    <link rel="stylesheet" type="text/css" href="{% static 'css/mui.min.css' %}"/>
    <link rel="stylesheet" type="text/css" href="{% static 'css/loaders.min.css' %}"/>
    <link rel="stylesheet" type="text/css" href="{% static 'css/loading.css' %}"/>
<script type="text/javascript">
	$(window).load(function(){
		$(".loading").addClass("loader-chanage")
		$(".loading").fadeOut(300)
	})
</script>
</head>
<!--loading页开始-->
<div class="loading">
	<div class="loader">
        <div class="loader-inner pacman">
          <div></div>
          <div></div>
          <div></div>
          <div></div>
          <div></div>
        </div>
	</div>
</div>
<!--loading页结束-->
<body>
	<header class="mui-bar mui-bar-nav" id="header">
		<a class="logo" href="index.html">
            <img src="{% static 'img/logo.png' %}"/>
        </a>
        <div class="top-sch-box flex-col">
            <div class="centerflex">
                <i class="fdj iconfont icon-sousuo"></i>
                <div class="sch-txt">搜索品牌、商品</div>
            </div>
        </div>
        <a class="btn" href="#">
            <i class="iconfont icon-fenlei1"></i>
            <p>分类</p>
            <span>2</span>
        </a>
    </header>
    <div id="main" class="mui-clearfix">
	    <!-- 搜索层 -->
	    <div class="pop-schwrap">
	        <div class="ui-scrollview">
	            <div class="mui-bar mui-bar-nav clone">
	                <a class="btn btn-back" href="javascript:;"></a>
	                <div class="top-sch-box flex-col">
	                    <div class="centerflex">
	                        <input class="sch-input mui-input-clear" type="text" name="" id="" placeholder="搜索品牌、商品" />
	                    </div>
	                </div>
	                <a class="mui-btn mui-btn-primary sch-submit" href="#">搜索</a>
	            </div>
	            <div class="scroll-wrap">
	                <div class="mui-scroll">
	                    <div class="sch-cont">
	                        <div class="section ui-border-b">
	                            <div class="tit"><i class="iconfont icon-hot"></i>热门搜索</div>
	                            <div class="tags">
	                                <span class="tag">智慧养老</span><span class="tag">养生食品</span><span class="tag">旅游度假</span><span class="tag">孝心礼品</span>
	                                <span class="tag actice">智慧养老</span><span class="tag">养生食品</span><span class="tag">旅游度假</span><span class="tag">孝心礼品</span>
	                                <span class="tag">养生</span><span class="tag actice">蜂蜜糖</span><span class="tag">运动鞋</span>
	                            </div>
	                        </div>
	                        <div class="section">
	                            <div class="tit"><i class="iconfont icon-time"></i>最近搜索</div>
	                            <div class="tags">
	                                <span class="tag">养生堂</span><span class="tag">好名字</span><span class="tag">真的</span><span class="tag">你猜</span>
	                                <span class="tag">这个是</span><span class="tag">什么</span><span class="tag">名字</span><span class="tag">这个是</span>
	                                <span class="tag">瑾晨</span><span class="tag">蜂蜜糖</span><span class="tag">哈哈哈</span>
	                            </div>
	                        </div>
	                    </div>
	                    <div class="sch-clear">
	                        <a href="javascript:void"><i class="iconfont">&#xe616;清除搜索历史</i></a>
	                    </div>
	                </div>
	            </div>
	        </div>
	    </div>
		
		<div class="contaniner clearfloat">
			<aside class="assort">
				<ul>
					<li class="active">
						<span>智慧养老</span>
					</li>
					<li>
						<span>养生食品</span>
					</li>
					<li>
						<span>旅游度假</span>
					</li>
					<li>
						<span>孝心礼品</span>
					</li>
					<li>
						<span>居家日用</span>
					</li>
				</ul>
			</aside>
			
			<section class="assort-cont clearfloat">
				<div class="sideMenu clearfloat">
					<h3><em></em>健康监测</h3>
					<div class="slist clearfloat box-s">
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/10.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
					</div>
					<h3><em></em>理疗产品</h3>
					<div class="slist clearfloat box-s">
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/1.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/1.jpg' %}"/>
								<p class="tit">电子血压计</p>
							</a>
						</div>
					</div>
					<h3><em></em>体育用品</h3>
					<div class="slist clearfloat box-s">
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/2.jpg' %}"/>
								<p class="tit">商品名称</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/2.jpg' %}"/>
								<p class="tit">商品名称</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/2.jpg' %}"/>
								<p class="tit">商品名称</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/2.jpg' %}"/>
								<p class="tit">商品名称</p>
							</a>
						</div>
					</div>
					<h3><em></em>数码产品</h3>
					<div class="slist clearfloat box-s">
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/3.jpg' %}"/>
								<p class="tit">蓝莓装</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/3.jpg' %}"/>
								<p class="tit">蓝莓装</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/3.jpg' %}"/>
								<p class="tit">蓝莓装</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/3.jpg' %}"/>
								<p class="tit">蓝莓装</p>
							</a>
						</div>
					</div>
					<h3><em></em>家政服务</h3>
					<div class="slist clearfloat box-s">
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/5.jpg' %}"/>
								<p class="tit">电饭煲</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/5.jpg' %}"/>
								<p class="tit">电饭煲</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/5.jpg' %}"/>
								<p class="tit">电饭煲</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/5.jpg' %}"/>
								<p class="tit">电饭煲</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/5.jpg' %}"/>
								<p class="tit">电饭煲</p>
							</a>
						</div>
						<div class="list clearfloat fl">
							<a href="pro-detail.html">
								<img src="{% static 'upload/5.jpg' %}"/>
								<p class="tit">电饭煲</p>
							</a>
						</div>
					</div>
				</div>
			</section>
		</div>
	</div>
	<footer class="page-footer fixed-footer" id="footer">
		<ul>
			<li>
				<a href="index.html">
					<img src="{% static 'img/footer001.png' %}"/>
					<p>首页</p>
				</a>
			</li>
			<li class="active">
				<a href="assort.html">
					<img src="{% static 'img/footer002.png' %}"/>
					<p>分类</p>
				</a>
			</li>
			<li>
				<a href="shopcar.html">
					<img src="{% static 'img/footer003.png' %}"/>
					<p>购物车</p>
				</a>
			</li>
			<li>
				<a href="pcenter.html">
					<img src="{% static 'img/footer004.png' %}"/>
					<p>个人中心</p>
				</a>
			</li>
		</ul>
	</footer>
</body>
	<script type="text/javascript" src="{% static 'js/jquery-1.8.3.min.js' %}" ></script>
	<script src="{% static 'js/jquery.SuperSlide.2.1.js' %}" type="text/javascript"></script>
	<script src="{% static 'js/fastclick.js' %}"></script>
	<script src="{% static 'js/mui.min.js' %}"></script>
	<script type="text/javascript" src="{% static 'js/hmt.js' %}" ></script>
	<!--插件-->
	<link rel="stylesheet" href="{% static 'css/swiper.min.css' %}">
	<script src="{% static 'js/swiper.jquery.min.js' %}"></script>
	<!--插件-->
	<script src="{% static 'js/global.js' %}"></script>
	<script >
	    $(function () {
	        var banner = new Swiper('.banner',{
	            autoplay: 5000,
	            pagination : '.swiper-pagination',
	            paginationClickable: true,
	            lazyLoading : true,
	            loop:true
	        });
	
	         mui('.pop-schwrap .sch-input').input();
	        var deceleration = mui.os.ios?0.003:0.0009;
	         mui('.pop-schwrap .scroll-wrap').scroll({
	                bounce: true,
	                indicators: true,
	                deceleration:deceleration
	        });
	        $('.top-sch-box .fdj,.top-sch-box .sch-txt,.pop-schwrap .btn-back').on('click',function () {
	            $('html,body').toggleClass('holding');
	            $('.pop-schwrap').toggleClass('on');
	            if($('.pop-schwrap').hasClass('on')) {;
	                $('.pop-schwrap .sch-input').focus();
	            }
	        });
	
	    });
	</script>
	<script type="text/javascript">
		jQuery(".sideMenu").slide({
			titCell:"h3",
			targetCell:".slist",
			effect:"slideDown",
			delayTime:300 ,
			triggerTime:150,
			defaultPlay:true,
			returnDefault:false,
			trigger:"click"
			});
	</script>
</html>